<template>
<div class="tips">
    <span class="tip" v-for='item of data' :key='item'>
        {{item}}
    </span>
</div>
</template>

<script lang='ts'>
import {Component, Vue, Prop} from 'vue-property-decorator';

@Component
export default class Tips extends Vue{

    @Prop()
    data?: Array<string>
    
}

</script>

<style scoped lang='less'>

.tips{
    padding: 0 30*@rem;
}

.tip{
    display: inline-block;
    margin-right: 20*@rem;
    padding: 6*@rem 10*@rem;
    border-radius: 6*@rem;
    background: @mainColor;
    color: @fontColorLight;
    text-align: center;
}

</style>